@charset "utf-8";

html { position:relative; min-height:100%; }
body { padding:0; margin-bottom:350px; color:#333; background:#fff; font:14px/1.428571429 'segoe ui','microsoft yahei','\5fae\8f6f\96c5\9ed1',sans-serif; text-rendering:optimizeLegibility; -webkit-font-smoothing:antialiased; }
a { text-decoration:none!important; }
ol, ul { list-style:none; }
h1, h2, h3, h4, h5, h6 { font-weight:normal; }
input, textarea { color:#333; background:#fff; font:15px/1.428571429 'segoe ui','microsoft yahei','\5fae\8f6f\96c5\9ed1',sans-serif; }

:focus { outline:0; }

.container { width:1300px; padding:0; max-width:none!important; }
.btn-green, .btn-green:focus, .btn-green:hover, .btn-green:active { color:#fff; border:0; }
.btn-green { background:#1abc9c; }
.btn-green:focus, .btn-green:hover, .btn-green:active { background:#16a085; }

.btn-orange, .btn-orange:focus, .btn-orange:hover, .btn-orange:active { color:#fff!important; border:0; }
.btn-orange { background:#fa7a1f; }
.btn-orange:focus, .btn-orange:hover, .btn-orange:active { background:#ec971f; }

.btn-lg { font-size:21px; min-width:150px; }

.navbar-header { float:none; }
.navbar-header .navbar-brand { float:left; padding:0; width:300px; height:50px; margin:20px 45px 20px 0; }
.navbar-header .navbar-logo { background:url('../images/logo.png') no-repeat 0 50%; }
.navbar-header .navbar-slogan { display:none; float:left; margin:20px 0; width:300px; height:50px; }
.navbar-header .navbar-form { position:relative; width:260px; border:0; margin:0; padding:27px 0; -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none; }
.navbar-header .navbar-form .form-group { display:inline-block; width:100%; background:#fff; border:1px solid #e5e5e5; margin-top:-1px; margin-bottom:-1px; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; }
.form-control { width:100%!important; height:36px; padding:6px 12px; font-size:14px; color:#666; vertical-align:middle; background-color:#fff; background-image:none; border:1px solid transparent; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none; }
.form-control:focus { border-color:#fff; outline:0; -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none; }
.icon-search { position:absolute; top:0; right:0; margin:27px 0; padding:0; height:36px; width:48px; color:#ddd!important; background:none; text-align:center; vertical-align:middle; }

.nav { padding:0; list-style:none; }
.nav-main { position:relative; height:36px; width:100%; background:#1abc9c; border:0; color:#fff; }
.nav-main li { float:left; margin-right:20px; }
.nav-main a { display:inline-block; color:#fff; font-size:16px; line-height:36px; min-width:66px; text-align:center; }
.nav-main a:focus, .nav-main a:hover { text-decoration:none; }
.nav-main li.active a { background:#16a085; }
.nav-main li.pull-right { margin-right:-16px; }
.nav-main li.open { position:relative; }
.nav-main li .dropdown-menu { position:absolute; float:none; -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; }
.nav-main li .dropdown-menu li { float:none; margin:0; }
.nav-main li .dropdown-menu li a { display:block; text-align:left; }
.nav-main .open>a, .nav-main .open>a:focus, .nav-main .open>a:hover { background:#16a085; }

.header { background:url('../images/home_header.jpg') 50% 50%; background-size:cover; min-height:530px; text-align:center; }
.header .header-title { margin:140px auto 85px; font-size:60px; color:#fff; }
.header .header-title .sub { margin-top:10px; display:block; font-size:30px; color:#ccc; }

.scrollup { background:url('../images/icon_gototop.png') no-repeat scroll 0 0; position:fixed; z-index:15; width:40px; height:40px; right:20px; bottom:20px; text-indent:-9999px; display:none; }

/* Grid */
.row { margin-left:-10px; margin-right:-10px; }
.row .col-8 { width:8.3333333333333333333333333333333%; float:left; }
.row .col-16 { width:16.666666666666666666666666666667%; float:left; }
.row .col-11 { width:11.111111111111111111111111111111%; padding:0 10px; float:left; }
.row .col-14 { width:14.285714285714285714285714285714%; padding:0 10px; float:left; }
.row .col-20 { width:20%; padding:0 10px; float:left; }
.row .col-25 { width:25%; padding:0 10px; float:left; }
.row .col-33 { width:33.33333333333333%; padding:0 10px 0 0; float:left; }
.row .col-35 { width:35%; padding:0 10px; float:left; }
.row .col-40 { width:40%; padding:0 10px; float:left; }
.row .col-45 { width:45%; padding:0 10px; float:left; }
.row .col-50 { width:50%; float:left; }
.row .col-60 { width:60%; padding:0 10px; float:left; }
.row .col-55 { width:55%; padding:0 10px; float:left; }
.row .col-65 { width:65%; padding:0 10px; float:left; }
.row .col-75 { width:75%; padding:0 10px; float:left; }
.row .col-100 { width:100%; float:left; }

.page-block { margin:50px 0 30px; }
.page-block-gray { margin:0; padding:50px 0 30px; background:#f2f2f2; }
.page-block-title { font-size:21px; margin:0 0 15px; }

.course-list .course { position:relative; background:#fff; border:1px solid #e6e6e6; min-height:210px; margin-bottom:20px; }
.course-list .course-img, .course-list .course-img .shade { position:relative; display:block; }
.course-list .course-img .shade:after { content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.3); opacity:0; -webkit-transition:all .5s; transition:all .5s; }
.course-list .course-img .shade:hover:after { opacity:1; }
.course-list .course-img img { width:100%; height:140px; vertical-align:top; }
.course-list .course-img .course-ch { position:absolute; top:0; right:0; width:70px; height:25px; background:#1abc9c; color:#fff; line-height:25px; text-align:center; }
.course-list .course-img .course-time { position:absolute; left:0; bottom:0; padding:0 15px; width:100%; height:25px; line-height:25px; color:#fff; background:rgba(0,0,0,.7); text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }
.course-list .course-title { padding:0 15px; margin-top:10px; font-size:14px; }
.course-list .course-title span { display:block; padding:0 0 8px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }
.course-list .course-title a .course-name { color:#aaa; }
.course-list .course-title a .course-name-ch { color:#333; }
.course-list .course-info { position:absolute; left:0; bottom:15px; width:100%; font-size:12px; color:#aaa; }
.course-list .course-tag, .course-list .course-info-line { padding:0 15px; }
.course-list .course-tag { margin-bottom:10px; }
.course-list .course-tag a { color:#16a085; margin-right:5px; }

.article-list .row { margin-left:0; margin-right:0; }
.article-list .article-img { position:relative; display:block; margin-bottom:10px; }
.article-list .article-img img { width:100%; height:410px; vertical-align:top; }
.article-list .article-img .article-title { position:absolute; left:0; bottom:0; padding:0 15px; width:100%; height:25px; line-height:25px; color:#fff; background:rgba(0,0,0,.7); text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }
.article-list .article-img-list { margin-right:-10px; /*height:*/ }
.article-list .article-img-list .article-img img { height:120px; }
.article-list .article { margin-bottom:20px; height:120px; }
.article-list .article img { width:234px; height:120px; }
.article-list .article .article-detail { width:260px; }
.article-list .article .article-detail span { display:block; }
.article-list .article .article-detail .article-title { display:block; margin:5px 0; }
.article-list .article .article-detail .article-title a { color:#333; }
.article-list .article .article-detail .article-info { font-size:12px; color:#aaa; }

.new-article-list { margin-bottom:60px; }
.new-article-list .article .article-detail { width:720px; }
.new-article-list .article .article-detail .article-title { font-size:18px; display:block; margin:0 0 10px; }
.new-article-list .article .article-detail .article-info { font-size:12px; color:#666; }
.new-article-list .article .post-by { margin-top:12px; }
.new-article-list .article .post-by a, .new-article-list .article .post-by span { display:inline; }
.new-article-list .article .post-by a { color:#1abc9c; }
.new-article-list .article .post-by .time { margin-left:10px; color:#aaa; }
.new-article-list .article .post-by .like { margin-right:20px; color:#aaa; }

.article-details { margin-bottom:60px; }
.article-header { margin-bottom:20px; }
.article-header .article-title { font-size:20px; font-weight:normal; color:#333; }
.article-header .article-title a { color:#333; }
.article-header .post-by { font-size:12px; color:#8c8c8c; }
.article-header .post-by a { color:#1abc9c; }
.article-body { line-height:1.8; }
.article-body p { margin-bottom:1em; }
.article-body p img { max-width:100%; margin:0 auto; display:block; }
.article-body img { max-width:300px;}
.article-body p.paragraph { text-indent:2em; }
.article-comment-list { margin-bottom:60px; }
.article-comment-list ul, .article-comment-list li { margin:0; padding:0; list-style:none; }
.article-comment-list li { padding-bottom:20px; border-bottom:1px dashed #ddd; margin-bottom:20px; }
.article-comment-list .user-avatar img { width:96px; height:96px; }
.article-comment-list .comment { width:850px; }
.article-comment-list .comment .comment-author a { color:#333; }
.article-comment-list .comment .user-ranking { margin-left:10px; color:#aaa; }
.article-comment-list .comment .comment-body { margin:10px 0; font-size:12px; }
.article-comment-list .comment .comment-by { color:#aaa; }
.article-comment-list .comment .comment-by .time { margin-left:10px; }
.article-comment-list .comment .comment-by .like { margin-right:10px; }
.article-comment-list .comment-form { padding-bottom:20px; border-bottom:1px dashed #ddd; margin-bottom:20px; }
.article-comment-list .comment-form-input { width:850px; }
.article-comment-list .comment-form-input textarea { margin-bottom:6px; resize:vertical; width:100%; min-height:96px; border:1px solid #ccc; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; -webkit-box-shadow:inset 0 0 3px rgba(0, 0, 0, .1); -moz-box-shadow:inset 0 0 3px rgba(0, 0, 0, .1); box-shadow:inset 0 0 3px rgba(0, 0, 0, .1); }
.article-comment-list .comment-form-input .btn-green { min-width:100px; }
.comment-list-title { padding-bottom:10px; border-bottom:1px solid #ddd; margin-bottom:20px; font-size:20px; font-weight:normal; color:#333; }

.event-list .event { background:#f2f2f2; border:1px solid #e6e6e6; margin-bottom:20px; }
.event-list .event-img img { width:100%; height:180px; vertical-align:top; }

.editorial-course-list .course { background:#fff; border:1px solid #e6e6e6; min-height:300px; margin-bottom:20px; }

.teacher-list .teacher { position:relative; min-height:180px; margin-bottom:20px; }
.teacher-list .teacher-img { position:relative; display:block; border:1px solid #e6e6e6; }
.teacher-list .teacher-img img { width:100%; height:125px; vertical-align:top; }
.teacher-list .teacher-info { margin-top:10px; padding:0 5px; font-size:14px; }
.teacher-list .teacher-info span { display:block; padding:0 0 5px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }
.teacher-list .teacher-info a { color:#333; }

.college-list .college { margin:10px 0; }
.college-list .college-img img { width:100%; height:44px; vertical-align:top; }

.people-list { margin:0!important; }
.people-list .people-img { position:relative; display:block; }
.people-list .people-img img { width:100%; vertical-align:top; }
.people-list .people-img .description { display:none; position:absolute; right:-217px; top:0; z-index:5; width:217px; height:217px; color:#fff; background:#1abc9c; }
.people-list .people-img .description span { margin:0 30px; display:block; }
.people-list .people-img .description .people-name { margin-top:25px; font-size:18px; }
.people-list .people-img .description .people-title { font-size:14px; }
.people-list .people-img .description .people-bio { margin-top:20px; font-size:12px; }
.people-list a.active .description { display:block; }

img.grayscale { filter:grayscale(100%); -webkit-filter:grayscale(100%); filter:gray; -webkit-transition:all .6s ease; filter:url('data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale'); }
img.grayscale:hover{ filter:grayscale(0%); -webkit-filter:grayscale(0%); filter:url('data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale'); }

.free-trial { border:1px solid #ddd; background:url('../images/free_trial.png') no-repeat 50% 0; min-height:250px; text-align:center; }
.free-trial-title { font-size:30px; margin:60px auto 30px; }

.forum-nav { margin-bottom:20px; padding:20px; border:1px solid #ddd; }
.forum-nav a { margin-right:1em; color:#333; }

.forum { margin-bottom:20px; padding:20px; border:1px solid #ddd; }
.forum nav, .forum .pagination { margin:0; }
.forum nav .btn { border:0; -webkit-border-radius:1px; -moz-border-radius:1px; border-radius:1px; color:#333; }
.forum nav .btn:hover, .forum nav .btn:focus, .forum nav .btn:active { color:#333; }
.forum nav .btn.active { background:#e6e6e6!important; -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none; }

.forum-thread-list { margin:20px 0; }
.forum-thread-list .thread { position:relative; margin-bottom:15px; padding:0 0 15px 64px; border-bottom:1px dotted #ddd; min-height:65px; }
.forum-thread-list .thread img { position:absolute; left:0; top:0; width:50px; height:50px; }
.forum-thread-list .thread-title { margin:5px 0; font-size:16px; line-height:1.6; }
.forum-thread-list .thread-title a { color:#333; }
.forum-thread-list .thread-title.hot a { color:#18bd9d; }
.forum-thread-list .thread-info { word-spacing:5px; }
.forum-thread-list .thread-info, .forum-thread-list .thread-info a { color:#999; }

.aside { margin-bottom:60px; }
.aside ul, .aside li { margin:0; padding:0; list-style:none; }
.aside .btn-block { -webkit-border-radius:0; -moz-border-radius:0; border-radius:0; }
.aside .aside-block { margin-bottom:30px; }
.aside .aside-block-title { padding-bottom:10px; border-bottom:1px solid #ddd; margin-bottom:20px; font-size:16px; font-weight:normal; color:#333; }
.aside .hot-article-list li { padding-bottom:15px; border-bottom:1px dashed #ddd; margin-bottom:15px; }
.aside .hot-article-list .article-img img { width:60px; height:60px; }
.aside .hot-article-list .article-title { width:240px; }
.aside .hot-article-list .article-title a { color:#333; }

.aside .qr-code { padding:20px; border:1px solid #dedede; text-align:center; }
.aside .qr-code p { margin:0 0 20px; }
.aside .qr-code img { margin:0 auto; max-width:100%; }

.aside .popular-comments li { padding-bottom:15px; border-bottom:1px dashed #ddd; margin-bottom:15px; }
.aside .popular-comments .post-by a { color:#1abc9c; }
.aside .popular-comments .post-by .time { margin-left:10px; color:#aaa; }
.aside .popular-comments .comment { position:relative; margin:15px 0; padding:20px; font-size:12px; background:#ddd; }
.aside .popular-comments .comment:before { content:''; position:absolute; top:-12px; left:25px; display:block; border:6px solid #ddd; border-color:transparent transparent #ddd; }
.aside .popular-comments .comment-via { font-size:12px; color:#aaa; }
.aside .popular-comments .comment-via a { color:#666; }

.aside .commu-blocks-nav { font-size:14px; font-weight:bold; border:1px solid #dbdddc; }
.aside .commu-blocks-nav li { margin:0; width:50%; text-align:center; }
.aside .commu-blocks-nav li a { margin:0; border-width:4px 0 0; padding-top:6px; border-color:transparent; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -webkit-border-radius:0; -moz-border-radius:0; border-radius:0; background:#fafafa; color:#333; }
.aside .commu-blocks-nav li a:hover, .aside .commu-blocks-nav li a:focus, .aside .commu-blocks-nav li a:active { border-width:4px 0 0; border-color:transparent; }
.aside .commu-blocks-nav li:first-child { border-right:1px solid #dbdddc; }
.aside .commu-blocks-nav li.active a { background:#fff; border-top-color:#1bbc9b; }
.aside .commu-blocks-content { font-size:14px; border:1px solid #dbdddc; border-width:0 1px; }
.aside .commu-blocks-content li { float:left; margin:0; width:50%; text-align:center; border-bottom:1px solid #dbdddc; }
.aside .commu-blocks-content li a { display:block; margin:0; padding:10px 15px; border:0; color:#333; }
.aside .commu-blocks-content li:nth-child(odd) { border-right:1px solid #dbdddc; }
.aside .commu-blocks-content li.hot a { color:#fa7a21; }

.aside .commu-stats { border:1px solid #dedede; padding:20px; }
.aside .commu-stats .thread-stats { margin-bottom:30px; }
.aside .commu-stats .thread-stats li { float:left; margin:0; width:50%; padding:15px; text-align:center; font-size:12px; color:#989898; border-bottom:1px solid #e6e6e6; }
.aside .commu-stats .thread-stats li .count { display:block; font-size:16px; color:#f87b1f; }
.aside .commu-stats .thread-stats li:nth-child(odd) { border-right:1px solid #e6e6e6; }
.aside .commu-stats .thread-stats li:nth-child(1), .aside .commu-stats .thread-stats li:nth-child(2) { padding-top:0; }
.aside .commu-stats .thread-stats li:nth-child(3), .aside .commu-stats .thread-stats li:nth-child(4) { padding-bottom:0; border-bottom:0; }
.aside .commu-stats h4 { font-size:14px; font-weight:bold; margin-top:0; }
.aside .commu-events .event { text-align:center; font-size:12px; color:#333; margin-bottom:20px; }
.aside .commu-events .event a { color:#333; }
.aside .commu-events .event img { margin-bottom:10px; width:100%; }

.aside .commu-qr-code { border:1px solid #dedede; padding:20px; }
.aside .commu-qr-code h4 { font-size:14px; font-weight:bold; margin-top:0; }
.aside .commu-qr-code .qr-code { float:left; width:50%; padding:0; border:0; font-size:12px; text-align:center; color:#333; }
.aside .commu-qr-code .qr-code a { color:#333; text-decoration:none; }
.aside .commu-qr-code .qr-code img { width:100%; margin-bottom:5px; }
.aside .commu-qr-code .weibo { padding-right:8px; }
.aside .commu-qr-code .wechat { padding-left:8px; }

.search { margin:-30px 0 0; }
.search-sec, .search-sec li { list-style:none; margin:0; padding:0; }
.search-field { border-bottom:1px dashed #e5e5e5; font-size:14px; }
.search-field > div { display:table; margin:10px 0; width:100%; }
.search-sort { display:table-cell; vertical-align:top; color:#333; font-size:14px; font-weight:700; line-height:30px; width:4em; padding:0; margin:0; }
.search-list-wrapper { display:table-cell; }
.search-list, .search-list li { list-style:none; margin:0; padding:0; line-height:30px; }
.search-list { vertical-align:top; padding:0; padding-right:11px; }
.search-list:after, .search-list:before { content:""; display:table; }
.search-list li { float:left; padding:0 15px; }
.search-list li a { color:#6e6e6e; text-decoration:none; }
.search-list li.active a { color:#16a085; cursor:default; }

nav { margin:40px auto; text-align:center; }
.pagination, .pagination * { -webkit-border-radius:0!important; -moz-border-radius:0!important; border-radius:0!important; }
.pagination li span, .pagination li a { margin:0 4px; color:#333; min-width:40px; border-color:#f3f3f3!important; cursor:default!important; }
.pagination li span:hover, .pagination li span:focus, .pagination li a:hover, .pagination li a:focus { background:#16a085!important; color:#fff!important; }
.pagination li.active span, .pagination li.active a { background:#1abc9c!important; }

.footer { position:absolute; bottom:0; width:100%; height:350px; color:#8c9398; background-color:#242830; }
.footer .container { position:relative; padding-top:60px; height:100%; }
.footer .footer-brand { width:360px; }
.footer .footer-logo { float:left; padding:0; width:300px; height:50px; background:url('../images/logo.png') no-repeat 0 50%; }
.footer .footer-nav { width:460px; }
.footer .footer-nav h3 { margin:0 0 36px; font-size:14px; font-weight:normal; color:#fff; }
.footer .footer-nav ul, .footer .footer-nav li { margin:0; padding:0; list-style:none; }
.footer .footer-nav li, .footer .footer-nav li a { margin-bottom:20px; font-size:12px; color:#8c9398; }
.footer .social { width:300px; text-align:center; }
.footer .social p { font-size:12px; color:#fff; clear:both; }
.footer .social .qr-code { margin:0 10px 15px; }
.footer .social .qr-code, .footer .social .qr-code img { width:128px; height:128px; }
.footer .copyright { position:absolute; bottom:0; left:0; right:0; width:100%; height:60px; line-height:60px; color:#8c9398; font-size:12px; border-top:1px solid #191b21; }
.footer .copyright a { color:#8c9398; }